<template>
	<view>
		<!-- 搜索框以及上面广告 -->
		<view class="home1">
			<view class="home1-1">
				<view class="home11">
					<image src="../../static/img/choujiang.png" mode=""></image>
					<view>抽奖</view>
				</view>
				<view class="home12">
					<u-search placeholder="" v-model="keyword" shape="round" :show-action="false"></u-search>
				</view>
				<view class="home13">
					<view class="home-13">
						<image src="../../static/img/qiehuan.png" mode=""></image>
						<view>版本</view>
					</view>
					<view class="home-13">
						<image src="../../static/img/kefu.png" mode=""></image>
						<view>客服</view>
					</view>
					<view class="home-13">
						<image src="../../static/img/xiaoxi.png" mode=""></image>
						<view>消息</view>
					</view>
				</view>
			</view>
			<view class="home1-2">
				<view class="home21" @click="goaccount">
					<image src="../../static/img/wodezhanhu.png" mode=""></image>
					<view>我的账户</view>
				</view>
				<view class="home21" @click="gotran">
					<image src="../../static/img/zhuanzhang.png" mode=""></image>
					<view>转账</view>
				</view>
				<view class="home21" @click="godetail">
					<image src="../../static/img/mingxi.png" mode=""></image>
					<view>明细查询</view>
				</view>
				<view class="home21" @click="saoyisao">
					<image src="../../static/img/saoyisao.png" mode=""></image>
					<view>扫一扫</view>
				</view>
			</view>
		</view>
		<!-- 详情 -->
		<view class="home2">
			<!-- 选项 -->
			<view class="home2-1">
				<view class="home22">
					<image src="../../static/img/xinyong.png" mode=""></image>
					<view>信用卡</view>
				</view>
				<view class="home22">
					<image src="../../static/img/cunkan.png" mode=""></image>
					<view>存款</view>
				</view>
				<view class="home22">
					<image src="../../static/img/jinbi (3).png" mode="" @click="fund"></image>
					<view>理财产品</view>
				</view>
				<view class="home22">
					<image src="../../static/img/dkw.png" mode=""></image>
					<view>贷款</view>
				</view>
				<view class="home22">
					<image src="../../static/img/wangdian.png" mode=""></image>
					<view>网点服务</view>
				</view>
				<view class="home22">
					<image src="../../static/img/shenhuo.png" mode=""></image>
					<view>生活缴费</view>
				</view>
				<view class="home22">
					<image src="../../static/img/hot.png" mode=""></image>
					<view>热门活动</view>
				</view>
				<view class="home22">
					<image src="../../static/img/jindou.png" mode=""></image>
					<view>小豆乐园</view>
				</view>
				<view class="home22">
					<image src="../../static/img/chengshi.png" mode=""></image>
					<view>城市专区</view>
				</view>
				<view class="home22">
					<image src="../../static/img/All.png" mode=""></image>
					<view>全部</view>
				</view>
			</view>
			<!-- 头条 -->
			<view class="home2-2">
				<u-notice-bar mode="vertical" :list="list"></u-notice-bar>
			</view>
			<!-- 广告块 -->
			<view class="home2-3">
				<view class="home23">
					<text class="home23-1"><text>美元（USD）</text>730.16</text>
					<text class="home23-1"><text>黄金（USD）</text>445.96</text>
				</view>
				<!-- 轮播图 -->
				<view class="home24">
					<u-swiper :list="list1"></u-swiper>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				// 搜索框内容
				keyword: '',
				// 滚动头条
				list: [
					'张奥平：MLF调降15bp将带动5年期LPR大幅降息',
					'中国农业银行服务价格标准（2023）',
					'百度"割肉"造车背后：为迎接无人驾驶新时代',
					'数据整理：新西兰联储大概率将按兵不动'
				],
				list1: [{
						image: '../../static/img/pink.jpg'
					},
					{
						image: '../../static/img/pink1.jpg'
					},
					{
						image: '../../static/img/pink2.jpg'
					},
					{
						image: '../../static/img/pink3.jpg'
					},
				]
			}
		},
		methods: {
			// 跳转我的账户
			goaccount() {
				
				uni.navigateTo({
					url: "/pages/My_account/My_account"
				})
			},
			// 跳转明细查询
			godetail() {
				uni.navigateTo({
					url: "/pages/detail/detail"
				})
			},
			// 跳基金
			fund() {
				uni.navigateTo({
					url: "/pages/fund/fundPage"
				})
			},
			// 跳转转账
			gotran() {
				uni.navigateTo({
					url:"/pages/transfer_accounts/transfer_accounts"
				})
			},
			//扫一扫
			saoyisao(){
				uni.scanCode({
					success: (res) => {
						console.log(res);
						this.msg = res.result;
						
						// Check if the scanned result matches the target URL
						if (res.result === 'pages/numberTransfer/numberTransfer') {
							uni.navigateTo({
								url: '/pages/numberTransfer/numberTransfer'
							});
						}if(res.result === 'pages/numberTransfer1/numberTransfer1'){
							uni.navigateTo({
								url: '/pages/numberTransfer1/numberTransfer1'
							});
						}
					}
				});
			}


		}
	}
</script>

<style scoped>
	.home1 {
		height: 400rpx;
		background-color: #ffa500ad;
		/* position: relative; */
	}

	.home1-1 {
		display: flex;
		justify-content: space-around;
		position: fixed;
		top: 20rpx;
	}

	.home11 {
		margin-left: 30rpx;
		text-align: center;
	}

	.home11 image {
		width: 50rpx;
		height: 50rpx;

	}

	.home11 view {
		font-size: 15rpx;
		color: white;
	}

	.home12 {
		width: 400rpx;
		margin-left: 30rpx;
	}

	.home13 {
		width: 200rpx;
		display: flex;
		justify-content: space-around;
	}

	.home-13 {
		margin-left: 35rpx;
		text-align: center;
	}

	.home-13 image {
		width: 50rpx;
		height: 50rpx;
	}

	.home-13 view {
		font-size: 15rpx;
		color: white;
	}

	.home1-2 {
		width: 650rpx;
		height: 250rpx;
		background-color: white;
		box-shadow: 7rpx 7rpx 10rpx rgba(128, 128, 128, 0.2);
		position: absolute;
		top: 300rpx;
		border-radius: 30rpx;
		margin-left: 50rpx;
		display: flex;
		justify-content: space-around;
	}

	.home21 {
		margin-top: 40rpx;
		text-align: center;
	}

	.home21 image {
		width: 80rpx;
		height: 80rpx;
	}

	.home21 view {
		margin-top: 20rpx;
		font-size: 35rpx;
		font-weight: 600;
	}

	.home2 {
		margin-top: 200rpx;
	}

	.home2-1 {
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
		margin-left: 20rpx;
		border-bottom: 1px solid rgba(128, 128, 128, 0.2);
		padding-bottom: 20rpx;
	}

	.home22 {
		width: 140rpx;
		height: 140rpx;
		text-align: center;
		margin-top: 20rpx;
	}

	.home22 image {
		width: 70rpx;
		height: 70rpx;
	}

	.home22 view {
		margin-top: 5rpx;
		font-weight: 600;
	}

	.home2-2 {
		margin: 40rpx 0;
	}

	.home23 {
		width: 650rpx;
		height: 120rpx;
		box-shadow: 7rpx 7rpx 10rpx rgba(128, 128, 128, 0.2);
		border-radius: 20rpx;
		margin-left: 50rpx;
		text-align: center;
		line-height: 120rpx;
	}

	.home23-1 {
		font-size: 33rpx;
		font-weight: 600;
	}

	.home23-1 text {
		color: #C28E00;
	}

	.home24 {
		padding: 40rpx;
	}
</style>